@use '../config';
@use '../utils/util';

/* - Interaction 交互 -
************************* */

// Appearance
@if util.expect(config.$abbr-appearance) {

  #{util.class-generator(config.$abbr-appearance, none)} {
    appearance: none;
  }

}

// Cursor
@if util.expect(config.$abbr-cursor) {

  @each $key, $value in config.$map-cursor {

    #{util.class-generator(config.$abbr-cursor, $key)}
    {
      cursor: $value;
    }

  }

}

// Outline
@if util.expect(config.$abbr-outline) {

  @each $key, $value in (
    none: transparent + '',
    white: white,
    black: black
  ) {

    #{util.class-generator(config.$abbr-outline, $key)}
    {
      outline: 2px solid #{$value};
      outline-offset: 2px;
    }

  }

}

// Pointer Events
@if util.expect(config.$abbr-pointer-events) {

  @each $key, $value in (
    none: none,
    auto: auto
  ) {

    #{util.class-generator(config.$abbr-pointer-events, $key)}
    {
      pointer-events: $value;
    }

  }

}

// Resize
@if util.expect(config.$abbr-resize) {

  @each $key, $value in (
    none: none,
    x: horizontal,
    y: vertical,
    '': both
  ) {

    #{util.class-generator(config.$abbr-resize, $key)}
    {
      resize: $value;
    }

  }

}

// User Select
@if util.expect(config.$abbr-user-select) {

  @each $key, $value in (
    none: none,
    text: text,
    all: all,
    auto: auto
  ) {

    #{util.class-generator(config.$abbr-user-select, $key)}
    {
      user-select: $value;
    }

  }

}